<template>
	<div class="finance">
		<div class="title">账户信息</div>
		<div>
			<el-row class="info-row" v-show="isEdit == true">
				<el-col :span="3" class="subTitle">
					账户名
				</el-col>
				<el-col :span="5">
					<el-input class="info-input" :disabled="disabled" v-model="accountInfo.name"></el-input>
				</el-col>
				<el-col :span="3" class="subTitle">
					贷款银行
				</el-col>
				<el-col :span="5">
					<el-input class="info-input" :disabled="disabled" v-model="accountInfo.bank"></el-input>
				</el-col>
				<el-col :span="3" class="subTitle">
					还款信用卡号
				</el-col>
				<el-col :span="5">
					<el-input class="info-input" v-model="accountInfo.account"></el-input>
				</el-col>
			</el-row>
			<el-row class="info-row" v-show="isEdit == false">
				<el-col :span="8" class="info-label">
					账户名：
					<label class="text">{{accountInfo.name}}</label>
				</el-col>
				<el-col :span="8" class="info-label">
					贷款银行：
					<label class="text">{{accountInfo.brand}}</label>
				</el-col>
				<el-col :span="8" class="info-label">
					还款信用卡号：
					<label class="text">{{accountInfo.account}}</label>
				</el-col>
			</el-row>
		</div>
		<div class="title">费用信息</div>
		<div>
			<el-row class="info-row" v-show="isEdit == true">
				<el-col :span="3" class="subTitle">
					履约保证金
				</el-col>
				<el-col :span="5">
					<el-input class="info-input" v-model="priceInfo.bidBond">
						<template slot="append">元</template>
					</el-input>
				</el-col>
				<el-col :span="3" class="subTitle">
					评估费
				</el-col>
				<el-col :span="5">
					<el-input class="info-input" v-model="priceInfo.valuationFee">
						<template slot="append">元</template>
					</el-input>
				</el-col>
				<el-col :span="3" class="subTitle">
					上牌押金
				</el-col>
				<el-col :span="5">
					<el-input class="info-input" v-model="priceInfo.depositOnCard">
						<template slot="append">元</template>
					</el-input>
				</el-col>
			</el-row>
			<el-row class="info-row" v-show="isEdit == false">
				<el-col :span="8" class="info-label">
					履约保证金：
					<label class="text">{{priceInfo.bidBond}}元</label>
				</el-col>
				<el-col :span="8" class="info-label">
					评估费：
					<label class="text">{{priceInfo.valuationFee}}元</label>
				</el-col>
				<el-col :span="8" class="info-label">
					上牌押金：
					<label class="text">{{priceInfo.depositOnCard}}元</label>
				</el-col>
			</el-row>
			<el-row class="info-row" v-show="isEdit == true">
				<el-col :span="3" class="subTitle">
					资料押金
				</el-col>
				<el-col :span="5">
					<el-input class="info-input" v-model="priceInfo.dataDeposit">
						<template slot="append">元</template>
					</el-input>
				</el-col>
				<el-col :span="3" class="subTitle">
					质押金
				</el-col>
				<el-col :span="5">
					<el-input class="info-input" v-model="priceInfo.qualityDeposit">
						<template slot="append">元</template>
					</el-input>
				</el-col>
				<el-col :span="3" class="subTitle">
					上牌服务费
				</el-col>
				<el-col :span="5">
					<el-input class="info-input" v-model="priceInfo.ServiceChargeOnTheCard">
						<template slot="append">元</template>
					</el-input>
				</el-col>
			</el-row>
			<el-row class="info-row" v-show="isEdit == false">
				<el-col :span="8" class="info-label">
					资料押金：
					<label class="text">{{priceInfo.dataDeposit}}元</label>
				</el-col>
				<el-col :span="8" class="info-label">
					质押金：
					<label class="text">{{priceInfo.qualityDeposit}}元</label>
				</el-col>
				<el-col :span="8" class="info-label">
					上牌服务费：
					<label class="text">{{priceInfo.ServiceChargeOnTheCard}}元</label>
				</el-col>
			</el-row>
			<el-row class="info-row" v-show="isEdit == true">
				<el-col :span="3" class="subTitle">
					公证抵押费
				</el-col>
				<el-col :span="5">
					<el-input class="info-input" v-model="priceInfo.notarialMortgage">
						<template slot="append">元</template>
					</el-input>
				</el-col>
				<el-col :span="3" class="subTitle">
					垫资费
				</el-col>
				<el-col :span="5">
					<el-input class="info-input" v-model="priceInfo.padFee">
						<template slot="append">元</template>
					</el-input>
				</el-col>
				<el-col :span="3" class="subTitle">
					开发费用
				</el-col>
				<el-col :span="5">
					<el-input class="info-input" v-model="priceInfo.costOfDevelopment">
						<template slot="append">元</template>
					</el-input>
				</el-col>
			</el-row>
			<el-row class="info-row" v-show="isEdit == false">
				<el-col :span="8" class="info-label">
					公证抵押费：
					<label class="text">{{priceInfo.notarialMortgage}}元</label>
				</el-col>
				<el-col :span="8" class="info-label">
					垫资费：
					<label class="text">{{priceInfo.padFee}}元</label>
				</el-col>
				<el-col :span="8" class="info-label">
					开发费用：
					<label class="text">{{priceInfo.costOfDevelopment}}元</label>
				</el-col>
			</el-row>
			<el-row class="info-row" v-show="isEdit == true">
				<el-col :span="3" class="subTitle">
					预收保险
				</el-col>
				<el-col :span="5">
					<el-input class="info-input" v-model="priceInfo.prepaidInsurance">
						<template slot="append">元</template>
					</el-input>
				</el-col>
				<el-col :span="3" class="subTitle">
					保险返利
				</el-col>
				<el-col :span="5">
					<el-input class="info-input" v-model="priceInfo.insuranceRebate">
						<template slot="append">元</template>
					</el-input>
				</el-col>
				<el-col :span="3" class="subTitle">
					GPS费用
				</el-col>
				<el-col :span="5">
					<el-input class="info-input" v-model="priceInfo.gpsPrice">
						<template slot="append">元</template>
					</el-input>
				</el-col>
			</el-row>
			<el-row class="info-row" v-show="isEdit == false">
				<el-col :span="8" class="info-label">
					预收保险：
					<label class="text">{{priceInfo.prepaidInsurance}}元</label>
				</el-col>
				<el-col :span="8" class="info-label">
					保险返利：
					<label class="text">{{priceInfo.insuranceRebate}}元</label>
				</el-col>
				<el-col :span="8" class="info-label">
					GPS费用：
					<label class="text">{{priceInfo.gpsPrice}}元</label>
				</el-col>
			</el-row>
			<el-row class="info-row" v-show="isEdit == true">
				<el-col :span="3" class="subTitle">
					合计
				</el-col>
				<el-col :span="5">
					<el-input class="info-input" :disabled="disabled" v-model="priceInfo.total">
						<template slot="append">元</template>
					</el-input>
				</el-col>
			</el-row>
			<el-row class="info-row" v-show="isEdit == false">
				<el-col :span="8" class="info-label">
					合计：
					<label class="text">{{priceInfo.total}}元</label>
				</el-col>
			</el-row>
		</div>
		<div class="title">合同齐全</div>
		<div>
			<el-row class="info-row" v-show="isEdit == true">
				<el-col :span="3" class="subTitle">
					公司垫款日期
				</el-col>
				<el-col :span="5">
					<el-input class="info-input" :disabled="disabled" v-model="contractInfo.CompanyAdvancesDate"></el-input>
				</el-col>
				<el-col :span="3" class="subTitle">
					垫款金额
				</el-col>
				<el-col :span="5">
					<el-input class="info-input" :disabled="disabled" v-model="contractInfo.CompanyAdvancesMoney">
						<template slot="append">元</template>
					</el-input>
				</el-col>
				<el-col :span="3" class="subTitle">
					垫款更改金额
				</el-col>
				<el-col :span="5">
					<el-input class="info-input" :disabled="disabled" v-model="contractInfo.CompanyAdvancesChangeMoney"></el-input>
				</el-col>
			</el-row>
			<el-row class="info-row" v-show="isEdit == false">
				<el-col :span="8" class="info-label">
					公司垫款日期：
					<label class="text">{{contractInfo.CompanyAdvancesDate}}</label>
				</el-col>
				<el-col :span="8" class="info-label">
					垫款金额：
					<label class="text">{{contractInfo.CompanyAdvancesMoney}}元</label>
				</el-col>
				<el-col :span="8" class="info-label">
					垫款更改金额：
					<label class="text">{{contractInfo.CompanyAdvancesChangeMoney}}</label>
				</el-col>
			</el-row>
			<el-row class="info-row" v-show="isEdit == true">
				<el-col :span="3" class="subTitle">
					变动差额
				</el-col>
				<el-col :span="5">
					<el-input class="info-input" :disabled="disabled" v-model="contractInfo.VariableMargin"></el-input>
				</el-col>
				<el-col :span="3" class="subTitle">
					银行放贷日期
				</el-col>
				<el-col :span="5">
					<el-date-picker :disabled="disabledTwo" class="info-input" v-model="contractInfo.BankLendingDate" type="date" placeholder="请选择日期">
					</el-date-picker>
				</el-col>
				<el-col :span="3" class="subTitle">
					放款金额
				</el-col>
				<el-col :span="5">
					<el-input class="info-input" :disabled="disabledTwo" v-model="contractInfo.BankLendingMoney">
						<template slot="append">元</template>
					</el-input>
				</el-col>
			</el-row>
			<el-row class="info-row" v-show="isEdit == false">
				<el-col :span="8" class="info-label">
					变动差额：
					<label class="text">{{contractInfo.VariableMargin}}</label>
				</el-col>
				<el-col :span="8" class="info-label">
					银行放贷日期：
					<label class="text">{{contractInfo.BankLendingDate}}</label>
				</el-col>
				<el-col :span="8" class="info-label">
					放款金额：
					<label class="text">{{contractInfo.BankLendingMoney}}元</label>
				</el-col>
			</el-row>
			<el-row class="info-row" v-show="isEdit == true">
				<el-col class="subTitle" :span="3">备注</el-col>
				<el-col :span="21">
					<el-input class="info-textarea" :rows="3" type="textarea" placeholder="请输入" v-model="contractInfo.result"></el-input>
				</el-col>
			</el-row>
			<el-row class="info-row resultShrink" v-show="isEdit == false">
				<el-col class="subtitle" :span="3">备　　注</el-col>
				<el-col :span="12" class="text-height text-height-shrink" id='contractInfo'>
					{{ contractInfo.result }}
				</el-col>
				<el-col :span="3">
					<el-button class="credit-button-text" type="text" @click="$libs.changeHeight('contractInfo', contractInfo)">{{ contractInfo.shrinkText}}</el-button>
				</el-col>
			</el-row>
		</div>
	</div>
</template>
<script>
export default {
	name: 'finance',
	data() {
		return {
			isEdit: false,
			disabled: true,
			disabledTwo: false,
			accountInfo: {
				name: '',
				bank: '',
				account: '',
				orderNo: ''
			},
			priceInfo: {
				bidBond: '', //履约保证金
				valuationFee: '', //评估费
				depositOnCard: '', //上牌押金
				dataDeposit: '', //资料押金
				qualityDeposit: '', //质押金
				ServiceChargeOnTheCard: '', //上牌服务费
				notarialMortgage: '', //公证抵押费
				padFee: '', //垫资费
				costOfDevelopment: '', //开发费用
				prepaidInsurance: '', //预收保险
				insuranceRebate: '', //保险返利
				gpsPrice: '', //gps费用
				total: '', //合计
			},
			contractInfo: {
				CompanyAdvancesDate: '', //公司垫款日期
				CompanyAdvancesMoney: '', //垫款金额
				CompanyAdvancesChangeMoney: '', //垫款更改金额
				VariableMargin: '', //变动差额
				BankLendingDate: '', //银行放贷日期
				BankLendingMoney: '', //放贷金额
				result: '',
				shrink: false,
				shrinkText: '展开全部'
			},

		}
	},
	watch: {
		'priceInfo.bidBond': function(_cur, _old) {
			this.cucalTotal();
		},
		'priceInfo.valuationFee': function(_cur, _old) {
			this.cucalTotal();
		},
		'priceInfo.depositOnCard': function(_cur, _old) {
			this.cucalTotal();
		},
		'priceInfo.dataDeposit': function(_cur, _old) {
			this.cucalTotal();
		},
		'priceInfo.qualityDeposit': function(_cur, _old) {
			this.cucalTotal();
		},
		'priceInfo.ServiceChargeOnTheCard': function(_cur, _old) {
			this.cucalTotal();
		},
		'priceInfo.notarialMortgage': function(_cur, _old) {
			this.cucalTotal();
		},
		'priceInfo.padFee': function(_cur, _old) {
			this.cucalTotal();
		},
		'priceInfo.costOfDevelopment': function(_cur, _old) {
			this.cucalTotal();
		},
		'priceInfo.prepaidInsurance': function(_cur, _old) {
			this.cucalTotal();
		},
		'priceInfo.insuranceRebate': function(_cur, _old) {
			this.cucalTotal();
		},
		'priceInfo.gpsPrice': function(_cur, _old) {
			this.cucalTotal();
		},
		deep: true
	},
	methods: {
		cucalTotal() {
			this.priceInfo.total = 0;
			for (let i in this.priceInfo) {
				if (i != 'total') {
					this.priceInfo.total += parseFloat(this.priceInfo[i]) ? parseFloat(this.priceInfo[i]) : 0;
				}
			}
		},
		getFinanceData(_id, _cb, _cb2) {
			this.$http.get('/order/finSettlement/detail/' + _id).then((data) => {
				console.log(data);
				if (data.data.success) {
					let datas = data.data.data;
					if (_cb2) {
						_cb2();
					}
					this.accountInfo = {
						name: datas.customerName,
						bank: datas.bankName,
						orderNo: datas.orderNo
					}

					let priceInfoJson = {};
					$.each(datas.settlementCostList, function(i, val) {
						priceInfoJson[val.feeName] = val.feeAmount;
					});

					this.priceInfo = {
						bidBond: priceInfoJson['履约保证金'] ? priceInfoJson['履约保证金'] : '', //履约保证金
						valuationFee: priceInfoJson['评估费'] ? priceInfoJson['评估费'] : '', //评估费
						depositOnCard: priceInfoJson['上牌押金'] ? priceInfoJson['上牌押金'] : '', //上牌押金
						dataDeposit: priceInfoJson['资料押金'] ? priceInfoJson['资料押金'] : '', //资料押金
						qualityDeposit: priceInfoJson['质押金'] ? priceInfoJson['质押金'] : '', //质押金
						ServiceChargeOnTheCard: priceInfoJson['上牌服务费'] ? priceInfoJson['上牌服务费'] : '', //上牌服务费
						notarialMortgage: priceInfoJson['公证抵押费'] ? priceInfoJson['公证抵押费'] : '', //公证抵押费
						padFee: priceInfoJson['垫资费'] ? priceInfoJson['垫资费'] : '', //垫资费
						costOfDevelopment: priceInfoJson['开发费用'] ? priceInfoJson['开发费用'] : '', //开发费用
						prepaidInsurance: priceInfoJson['预收保险'] ? priceInfoJson['预收保险'] : '', //预收保险
						insuranceRebate: priceInfoJson['保险返利'] ? priceInfoJson['保险返利'] : '', //保险返利
						gpsPrice: priceInfoJson['gps费用'] ? priceInfoJson['gps费用'] : '', //gps费用
						total: priceInfoJson['合计'] ? priceInfoJson['合计'] : '', //合计
					};

					this.contractInfo = {
						CompanyAdvancesDate: datas.loaningDate, //公司垫款日期
						CompanyAdvancesMoney: datas.loaningAmount, //垫款金额
						CompanyAdvancesChangeMoney: datas.actualLoaningAmount != 0 ? (datas.actualLoaningAmount != datas.loaningAmount ? datas.actualLoaningAmount : '') : '', //垫款更改金额
						VariableMargin: parseInt(datas.loaningAmount) - parseInt(datas.actualLoaningAmount) != 0 ? parseInt(datas.loaningAmount) - parseInt(datas.actualLoaningAmount) : '', //变动差额
						BankLendingDate: datas.bankLoanDate, //银行放贷日期
						BankLendingMoney: datas.bankLoanAmount, //放贷金额
						result: datas.remark,
						shrink: false,
						shrinkText: '展开全部'
					}
				} else {
					if (_cb) {
						_cb();
					}
				}
			}).catch((error) => {

			});
		},
		financeEnter(_id, _isMust, _orderStatus, _cb) {
			this.isEdit = false;
			let settlementCos = {
				'履约保证金': 'bidBond',
				'评估费': 'valuationFee',
				'上牌押金': 'depositOnCard',
				'资料押金': 'dataDeposit',
				'质押金': 'qualityDeposit',
				'上牌服务费': 'ServiceChargeOnTheCard',
				'公证抵押费': 'notarialMortgage',
				'垫资费': 'padFee',
				'开发费用': 'costOfDevelopment',
				'预收保险': 'prepaidInsurance',
				'保险返利': 'insuranceRebate',
				'gps费用': 'gpsPrice',
				'合计': 'total'
			}
			let settlementCostList = [];
			let that = this,
				i = 0;
			$.each(settlementCos, function(index, el) {
				settlementCostList.push({
					feeAmount: that.priceInfo[el],
					feeName: index,
					feeType: i,
					orderNo: that.accountInfo.orderNo,
					// staffId: that.$store.state.staffId
				});
				i++;
			});
			let params = {
				"actualLoaningAmount": this.contractInfo.CompanyAdvancesChangeMoney,
				"bankLoanAmount": this.contractInfo.BankLendingMoney,
				"bankLoanDate": this.contractInfo.BankLendingDate,
				"bankName": this.accountInfo.bank,
				"customerName": this.accountInfo.name,
				"orderNo": this.accountInfo.orderNo,
				"remark": this.contractInfo.result,
				"repayAccount": this.accountInfo.account,
				"settlementCostList": settlementCostList
			};
			$.each(params, (i, val) => {
				console.log(val);
				if (val == undefined) {
					params[i] = null;
				} else if (typeof val == 'object' && new Date(val).getTime() > 0 && !isNaN(new Date(val).getTime())) {
					params[i] = this.$libs.formatDate(new Date(val), 'yyyy-MM-dd hh:mm:ss');
					if (i == 'bankLoanDate') {
						this.contractInfo.BankLendingDate = params[i];
					}
				}
			});
			console.log('paramss');
			console.log(params);
			if (_isMust && !this.$libs.mustWrite(param, ['remark', 'actualLoaningAmount'])) {
				this.$store.commit('isAllMustFalse');
				this.$libs.noneAddHightBorder();
				return;
			} else if (_isMust) {
				// this.$store.commit('isAllMustTrue');
			}
			this.$http.post('/order/finSettlement/detail/' + _id, params).then((data) => {
				console.log(data);
				if (data.data.success) {
					this.id = _id;
					this.$store.commit('saveNumAdd', this, _id);
					if (_cb) {
						_cb();
					}
				} else {
					this.$message.error(data.data.message);
				}

			}).catch((error) => {

			});
		}
	},
	mounted() {

	}
}

</script>
<style lang="scss" scoped>
@import '../../assets/css/site.scss';
.finance {
	font-size: 14px;
	color: #475669;
	padding-top: 17px;
}

</style>
